
.addInsurance{
  background-color: white;
  padding-bottom: 40px;
  .header{
    position: relative;
    width: 100%;
    top:0px;
    left: 0px;
    margin:0px;
    .header-image{
      width: 100%;
      margin-top: -60px;
    }
    .detail-btn{
      position: absolute;
      bottom:20px;
      right:20px;
      background-color: #E83B2F;
      border:1px solid white;
      border-radius: 24px;
      padding:10px 20px;
      font-size: 20px;
      font-weight: bold;
      color:white;
    }
  }
  .bodyer{
    padding:0px 20px;
    box-sizing: border-box;
    width: 100%;
    .points{
      font-size: 24px;
      margin-top: 8px;
      .num{
        font-size: 36px;
        color:#D6AE64;
        font-weight: bold;
      }
      .txt{
        font-weight: bold;
        font-size: 20px;
        color:#222;
        margin-left: 5px;
        margin-top:16px;
      }
    }
    .condition{
      .condition-item{
        margin-top: 20px;
        .cond-title{
          display: flex;
          align-items: center;
          justify-content: flex-start;
          .num{
            width: 20px;
            height: 20px;
            background-color: #E83B2F;
            border-radius: 12px;
            color: white;
            text-align: center;
            line-height: 20px;
            margin-right: 4px,
            
          }
          .title{
            font-size: 18px;
            font-weight: bold;
            color:#222
          }
        }
        .form{
          margin-top: 20px;
          .form-item{
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 60px;
            line-height: 60px;
            padding:0px 12px;
            &.underline{
              border-bottom: 1px solid #eee;
            }
            .form-label{
              width: 100px;
              flex-shrink: 0;
            }
            .form-value{
              &.form-flex{
                display: flex;
                align-items: center;
                justify-content: flex-end;
              }
              .placeholder{
                color:#999
              }
              .input{
                text-align: right;
              }
              
             
            }
            .form-icon{
              margin-bottom: 0px;
              margin-top: 2px;
            }
            .form-tip{
              display: flex;
              align-items: flex-start;
              justify-content: flex-start;
              margin-top: 20px;
              .form-checkbox{
                line-height: normal;
                margin-top: 2px;
              }
              .form-tip-text{
                line-height: normal;
                .agreement{
                  color: #5e70b8;
                }
              }
            }
          }
        }
        .insured-persons{
          margin-top: 12px;
          .person{
            border:1px solid #FF8600;
            border-radius: 6px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
            height: 50px;
            background-color: #FFF8F2;
            margin-top: 12px;
            padding:0px 20px;
            box-sizing: border-box;
            .name{
              font-size: 16px;
              font-weight: bold;
              color:#FF8600;
            }
            .tool{
              width: 46px;
              height: 40px;
              font-size: 16px;
              color:#999;
              line-height: 40px;

            }
          }
        }
        .select-btn{
          margin-top: 12px;
          display: flex;
          justify-content: center;
          align-items: center;
          width: 100%;
          border-radius: 6px;
          height: 46px;
          background-color: #e4e6e7;
          .at-icon{
            margin-right: 3px;
          }
          .add-txt{
            font-size: 16px;
            color: #222;
          }
        }

        .jifen{
          margin-top: 4px;
          display: flex;
          align-items: center;
          justify-content: flex-start;
          flex-direction: row;
          font-size: 20px;
          color:#222;
          .insure-num{
            color:#222;
          }
          .insure-info{
            font-size: 18px;
          }
          .insure-total{  
            font-size: 24px;
            color:#D6AE64;
            margin-bottom: 4px;
            font-weight: bold;
          }
          
        }
        .jifen-danger{
          display: flex;
          align-items: center;
          margin-top: 10px;
          .insure-danger-tip{
            font-size: 16px;
            font-weight: bold;
            color:#FF2D55;
          }
          .insure-get-more{
            margin-left: 6px;
            background-color: #2ECC71;
            border-radius: 12px;
            padding:4px 8px;
            color:white;
            font-size: 16px;
            font-weight: bold;
          }
        }
        .points-info{
          margin-top: 10px;
          .points-info-item{
            margin-top: 4px;
            .points-info-item-title{
              font-size: 12px;
              padding:2px 9px;
              background-color: #999;
              border-radius: 10px;
              color:white;
            }
            .points-info-item-desc{
              font-size: 12px;
              color:#222;
              margin-left: 10px;
            }
          }
          
        }
      }
    }
    .agree{
      margin-top: 20px;
      font-size: 16px;
      color:#999;
      display: flex;
      align-content: center;
      justify-content: flex-start;
      .radio{
        margin-top: 2px;
      }
      .agree-info{
        margin-left: 10px;
        color:#999;
        .agree-primary{
          color: #5e70b8;
        }
      }
      
    }
    .agree-btn{
      margin-top: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 60px;
      line-height: 60px;
      background-color: #E83B2F;
      border-radius: 24px;
      color:white;
      font-size: 24px;
      font-weight: bold;
      &.disabled{
        background-color: #999;
        pointer-events: none;
      }
    }
  }
}
.at-action-sheet{
  font-size: 16px;
  .at-action-sheet__container{
    .at-action-sheet__header,.at-action-sheet__footer{
      font-size: 16px;
      color:#222;
      padding:20px;
      box-shadow: none;
    }
    .at-action-sheet__body{
      .insured-person-action-sheet{
        .at-action-sheet__item{
          padding:0px;
          border:none;
          &::after{
            display: none;
          }
        }
      }
    }
    
  }
}
.insured-persons-action{
  position: fixed;
  top: 0;
  left:0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  box-sizing: border-box;
  overflow: hidden;
  display: none;
  &.show{
    display: block;
  }
  &.hide{
    display: none;
  }
  .shadow{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
  }
  .content{
    position: absolute;
    height: 60%;
    bottom:0px;
    left:0px;
    font-size: 16px;
    background-color: white;
    
    box-sizing: border-box;
    
    .insured-persons-action-header{
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 30px;
      line-height: 3  0px;
      border-bottom: 0.5px solid #eee;
      padding:20px;
      .cancel{
        
      }
      .title{
        font-weight: bold;
        font-size: 24px;
      }
      .confirm{
        color:#E83B2F
      }
    }
    .insured-person-action-body{
      
      border-top-left-radius: 12px;
      border-top-right-radius: 12px;
      height: 65%;
      font-size: 16px;
      padding:20px;
      .insured-person-item{
        display: flex;
        align-items: center;
        width: 100%;
        height: 50px;
        flex-direction: row;
        border-radius: 8px;
        margin-bottom: 8px;
        height: 80px;
        background-color: #f0f0f0;
        padding:10px;
        box-sizing: border-box;
        &.selected{
          color:#FF8600;
          background-color: #FFF8F2;
          border:1px solid #FF8600;
          .check-box-wrap{
            .checkbox{
              // background-color: #FF8600;
              // border:1px solid #FF8600;
            }
          }
        }
        .check-box-wrap{
          font-size: 16px;
          font-weight: bold;
          width: 20px;
          height: 20px;
          margin-right: 10px;
          
          .checkbox{
            width: 100%;
            height: 100%;
            border: none;
            outline: none;
            
          }
        }
        .insured-person-info{
          font-size: 16px;
          text-align: left;
          margin-left: 10px;
          .insured-person-name{
          }
          .insured-person-idCard{
            margin-top: 8px;
          }
        }
      }
    }
  }
  
}

.disabled{
  color:#999
}